<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Bootstrap 101 Template</title>
<!-- 最新 Bootstrap 核心 CSS 文件 -->
<link rel="stylesheet"
	href="http://cdn.bootcss.com/twitter-bootstrap/3.0.3/css/bootstrap.min.css">

<!-- 可选的Bootstrap主题文件（一般不用引入） -->
<link rel="stylesheet"
	href="http://cdn.bootcss.com/twitter-bootstrap/3.0.3/css/bootstrap-theme.min.css">

<!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
<script src="http://cdn.bootcss.com/jquery/1.10.2/jquery.min.js"></script>

<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
<script
	src="http://cdn.bootcss.com/twitter-bootstrap/3.0.3/js/bootstrap.min.js"></script>

<link type="text/css" rel="Stylesheet"
	href="${pageContext.request.contextPath }/css/bootstrap.css">
<link type="text/css" rel="Stylesheet"
	href="${pageContext.request.contextPath }/css/index.css">
<script type="text/javascript" src="js/bootstrap.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<script type="text/javascript" src="js/jquery-1.8.3.min.js"></script>
<script type="text/javascript">
	$(document).ready(function() {
		$("#XinxiGuanLi").click(function() {
			$("#GuanLi").fadeToggle(300);
		})

		$("#XinXiYingYongGuanLi").click(function() {
			$("#YingYongGuanLi").fadeToggle(300);
		})

		$("#XinxiGuanLi").mousemove(function() {
			$(this).css("background-color", "#696969");
		}).mouseout(function() {
			$(this).css("background-color", "black");
		});

		$("#XinXiYingYongGuanLi").mousemove(function() {
			$(this).css("background-color", "#696969");
		}).mouseout(function() {
			$(this).css("background-color", "black");
		});

		$("#YingYongGuanLi").mousemove(function() {
			$(this).css("background-color", "#696969");
		}).mouseout(function() {
			$(this).css("background-color", "black");
		});

		$("#GuanLi").mousemove(function() {
			$(this).css("background-color", "#696969");
		}).mouseout(function() {
			$(this).css("background-color", "black");
		});
	})

	$(function() {
		$("#categoryLevel1").change(function() {
			$.getJSON("Level2", {
				categoryLevel1 : $("#categoryLevel1").val()
			}, function(data) {
				var html = "<option value='0'>---请选择---</option>";
				$.each(data, function(i, item) {
					html += "<option value='"+item["id"]+"'>";
					html += item["categoryName"];
					html += "</option>";
				})
				$("#categoryLevel2").html(html);
				$("#categoryLevel3").html("");
			})
		})

		$("#categoryLevel2").change(function() {
			$.getJSON("Level3", {
				categoryLevel2 : $("#categoryLevel2").val()
			}, function(data) {
				var html = "<option value='0'>---请选择---</option>";
				$.each(data, function(i, item) {
					html += "<option value='"+item["id"]+"'>";
					html += item["categoryName"];
					html += "</option>";
				})
				$("#categoryLevel3").html(html);

			})
		})
	})
</script>

<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Bootstrap -->
</head>
<body>

	<div class="row"
		style="background-color: black; border: 3px solid #F5F5F5;">
		<div class="col-xs-12 col-sm-6 col-md-8"
			style="background-color: black; border: 1px solid black; width: 280px;">

			<div class="height">

				<div style="padding: 15px 10px; background-color: black;">
					<h1 style="color: white;">
						<img class="img-circle"
							style="width: 40px; height: 40px; vertical-align: bottom;"
							src="images/img.jpg" />APP BMS
					</h1>
				</div>

				<div style="border: 1px solid black; padding: 10px;">
					<img class="img-circle"
						style="width: 40px; height: 40px; vertical-align: bottom; float: left;"
						src="images/img.jpg" /><span id="Color"
						style="font-size: 15px; padding: 20px; 3 px; ">Welcome</span><br />
					<span id="Color" style="font-size: 11px; padding: 25px; 0 px; ">${devUser.devCode}</span>
					<br />
					<p id="Color">${devUser.devName}</p>
				</div>

				<div style="padding: 10px; border: 1px solid black;"
					id="XinxiGuanLi">
					<table>
						<tr>
							<td><img class="img-circle"
								style="width: 40px; height: 40px;"
								src="images/com.realarcade.doj.png" /><span id="Color"
								style="font-size: 22px; padding: 0px 20px;">APP客户管理</span></td>
						</tr>
					</table>
				</div>

				<div style="padding: 10px; border: 1px solid black; display: none;"
					id="GuanLi">
					<table>
						<tr>
							<td><img class="img-circle"
								style="width: 40px; height: 40px;"
								src="images/com.realarcade.doj.png" /><span id="Color"
								style="font-size: 22px; padding: 0px 20px;">客户管理</span></td>
						</tr>
					</table>
				</div>


				<div style="padding: 10px; border: 1px solid black;"
					id="XinXiYingYongGuanLi">
					<table>
						<tr>
							<td><img class="img-circle"
								style="width: 40px; height: 40px;"
								src="images/com.realarcade.doj.png" /><span id="Color"
								style="font-size: 22px; padding: 0px 20px;">APP应用管理</span></td>
						</tr>
					</table>
				</div>

				<div style="padding: 10px; border: 1px solid black; display: none;"
					id="YingYongGuanLi">
					<table>
						<tr>
							<td><img class="img-circle"
								style="width: 40px; height: 40px;"
								src="images/com.realarcade.doj.png" /><span id="Color"
								style="font-size: 22px; padding: 0px 20px;">应用管理</span></td>
						</tr>
					</table>
				</div>


			</div>

			<div id="DingWei">
				<table style="border: 1px solid black;">
					<tr>
						<td><img class="img-circle"
							style="width: 58px; height: 50px;"
							src="images/12202_1423823022_3258.png" /></td>
						<td><img class="img-circle"
							style="width: 58px; height: 50px;"
							src="images/12202_1457836809_7234.png" /></td>
						<td><img class="img-circle"
							style="width: 58px; height: 50px;"
							src="images/97100_1413809354_8137.png" /></td>
						<td><img class="img-circle"
							style="width: 58px; height: 50px;"
							src="images/com.doodleapps.powdertoy.png" /></td>
					</tr>
				</table>
			</div>
		</div>

		<div class="col-xs-6 col-md-4" style="width: 84%">
			<div class="tou">
				<div style="text-indent: 20px;">
					<span style="font-size: 20px;">APP信息管理维护 </span> <img
						class="img-circle"
						style="width: 40px; height: 40px; vertical-align: bottom;"
						src="images/img.jpg" /> <span style="font-size: 10px;">${devUser.devCode},您可以通过搜索或者其他的筛选项对APP的信息进行修改,删除的管理操作</span>
					<hr />
					<form action="information">
						<table class="table table-condensed">
							<tr>
								<td>软件名称:<input type="text" name="softwareName"></td>
								<td>APP状态: <select name="status">
										<option value="0">--请选择--</option>
										<c:forEach var="dataDictionaries" items="${dataDictionaries}">
											<option value="${dataDictionaries.valueId}">${dataDictionaries.valueName}</option>
										</c:forEach>
								</select>
								</td>
								<td>所属平台: <select name=“flatformId”>
										<option value="0">--请选择--</option>
										<option value="1">手机</option>
										<option value="2">平板</option>
								</select>
								</td>
							</tr>

							<tr>
								<td>一级分类:<select id="categoryLevel1" name="categoryLevel1">
										<option value="0">--请选择--</option>
										<option value="1">全部应用</option>
										<option value="2">全部游戏</option>
								</select></td>
								<td>二级分类:<select id="categoryLevel2" name="categoryLevel2"></select></td>
								<td>三级分类:<select id="categoryLevel3" name="categoryLevel3"></select></td>
							</tr>
							<tr>
								<td><input type="submit" value="查 询"></td>
							</tr>
						</table>

					</form>
				</div>
			</div>

			<div id="cha"
				style="height: 500px; background-color: #F5F5F5; border: 5px solid #808080;">
				<div style="text-indent: 20px;">
					<table class="table table-striped">
						<tr>
							<td><input type="button" value="新增APP基础信息" onclick="window.location.href('index')"></td>
						</tr>
						<tr>
							<td>软件名称:</td>
							<td>APK名称</td>
							<td>软件大小(单位:M)</td>
							<td>新属平台</td>
							<td>所属分类(一级分类,二级分类,三级分类)</td>
							<td>状态</td>
							<td>下载次数</td>
							<td>最新版本号</td>
							<td>操作</td>
						</tr>
						<c:forEach var="list" items="${list}">
							<tr>
								<td>${list.softwareName }</td>
								<td>${list.APKName }</td>
								<td>${list.softwareSize }</td>
								<td>${list.flatformName}</td>
								<td>${list.categoryLevel1Name}->${list.categoryLevel2Name}->${list.categoryLevel3Name}</td>
								<td>${list.statusName }</td>
								<td>${list.downloads }</td>
								<td>${list.versionNo }</td>
								<td>
									<div class="btn-group">
										<button type="button" class="btn btn-default dropdown-toggle"
											data-toggle="dropdown">
											点击操作 <span class="caret"></span>
										</button>
										<ul class="dropdown-menu" role="menu">
											<li><a href="updateFlatform?id=${list.id }&status=4">上架</a></li>
											<li><a href="updateFlatform?id=${list.id }&status=5">下架</a></li>
											<li><a href="addapp">新增版本</a></li>
											<li><a href="Versions?id=${list.id}&versionNo=${list.versionNo }">修改版本</a></li>
											<li><a href="updateApp?id=${list.id}">修改</a></li>
											<li><a href="checkAppById?id=${list.id}">查看</a></li>
											<li><a href="deleteAppInfo?id=${list.id}">删除</a></li>
										</ul>
									</div>
								</td>
							</tr>
						</c:forEach>
					</table>

					<c:if test="${totalPages>0}">
						<c:if test="${page>1}">
							<a href="?page=${page-1}&cid=${param.cid}">[上一页]</a>
						</c:if>
						<c:if test="${page<=1}">
							<a>[上一页]</a>
						</c:if>
						<c:if test="${page<totalPages}">
							<a href="?page=${page+1}&cid=${param.cid}">[下一页]</a>
						</c:if>
						<c:if test="${page>=totalPages}">
							<a>[下一页]</a>
						</c:if>
		            第 ${page} 页，共 ${totalPages} 页
	             </c:if>
				</div>
			</div>

			<div
				style="background-color: white; padding: 28px; border: 5px solid #808080;">
				<span style="float: right;">@2016 AllRights Reserved</span>
			</div>
		</div>
	</div>
</body>
</html>
